<!-- 离案 -->
<template>
  <div class='leave_case'>
    <div class="teamTop">
      <span> 共{{ total }}人 </span>
    </div>
    <div class="tab">
      <dt-grid ref="leaveTable" :page="pageData" :onFetch='onFetch' />
    </div>
    <!-- 查看成员 -->
    <check-user ref="checkUser" @onChangeTable='reTeamListHistory' />
    <!-- 变更成员 -->
    <Modal v-model="changeUserModal" title="成员变更" @on-cancel="AllModalCancel" width="600px"
      :footerHide="true">
      <change-user v-if="changeUserModal" @onClose='AllModalCancel' :RowUserData='RowUserData'
        :name="'leave'" @onChangeTable='reTeamListHistory' />
    </Modal>
  </div>
</template>
<script>
  import teamsApi from '@/biz/buildingManagement/teams'
  import columns from '../opt/leaveCaseColumns'
  import checkUser from './checkUser'
  import changeUser from './modal/changeUser'
  export default {
    components: {
      checkUser,
      changeUser,
    },
    data() {
      return {
        pageData: {
          total: 0,
          current: 1,
          rows: 10,
          pageSizeOpts: [10, 20, 30, 40, 50],
        },
        changeUserModal: false,
        RowUserData: {},
        total: 0,
      }
    },
    props: {
      userMess: {
        type: Object,
        default: () => {
          return {}
        },
      },
      buildingId: '',
      teamId: '',
      taskUserId: '',
    },
    methods: {
      //表格操作 查看
      checkUser(rows) {
        console.log(rows, '查看')
        this.$refs.checkUser.show(rows)
      },
      //表格操作 变更
      changeUser(rows) {
        console.log(rows, '变更')
        this.RowUserData = rows
        this.changeUserModal = true
      },
      //新增成员关闭
      AllModalCancel() {
        this.changeUserModal = false
      },
      reTeamListHistory() {
        this.$refs.leaveTable.fetch()
      },
      onFetch(data) {
        let params = {
          buildingId: this.buildingId,
          teamId: this.teamId,
          userId: this.taskUserId,
          ...data
        }
        return teamsApi.GetTeamHistory(params).then((res) => {
          if (res) {
            this.total = res.pages
            res.total = res.pages
            return res
          }
        })
      }
    },
    mounted() {
      this.$refs.leaveTable.init(this, new columns(this))
      this.$refs.leaveTable.fetch()
    },
  }
</script>
<style lang='scss' scoped>
  .leave_case {
    .tab {
      margin-top: 20px;
    }
  }
</style>